import React from 'react'

import './index.css'
/* 
  props
*/

// 父组件
export default class extends React.Component {
  state = {
    parentMsg: '',
    msg: '我是你的老父亲'
  }

  // 提供回调函数，用来接收数据
  getChildMsg = (e) => {
    this.setState({
      parentMsg: e
    })
  }
  render() {
    return (
      <div className="parent">
        父组件：{this.state.parentMsg}
        <Child setMsg={this.getChildMsg} state={this.state}></Child>
      </div>
    )
  }
}

// 子组件
class Child extends React.Component {
  state = {
    msg: '刷抖音'
  }
  sendMsg = () => {
    this.props.setMsg('我不信，你给我证明一下试试')
  }
  render() {
    console.log(this.props.children)
    console.log(this.props)
    return (
      <div className="child">
        <div>父组件传递个子组件的值：{this.props.state.msg}</div>
        子组件： <button onClick={this.sendMsg}>点我，给父组件传递数据</button>
      </div>
    )
  }
}
